<%--
  User: Shengzhao Li
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>更多...</title>
</head>
<body>
<%--account setting page--%>
<div id="account_setting_page" data-role="page" data-title="更多..." class="page">
    <div data-role="header" data-theme="f">
        <a href="${contextPath}/m/dashboard" data-icon="home" data-direction="reverse" data-transition="slide">主页</a>

        <h1>更多...</h1>
        <a href="${contextPath}/m/account/overview" data-icon="arrow-l" data-transition="flip">返回</a>
    </div>
    <div data-role="content">
        <p class="ui-bar-d ui-corner-top ui-corner-bottom details-area center" id="module_tip">
            如果你坚持记录你的账务信息,你将会有一个清晰的生活,所以...
        </p>

        <div class="center red" style="display: none;" id="account_setting_success_info">保存设置成功!</div>
        <form:form commandName="accountSetting" id="account_setting_form" data-ajax="false"
                   action="${contextPath}/m/account/setting">
            <div data-role="collapsible" data-collapsed="false" data-theme="a" data-content-theme="c">
                <h3>账务设置选项</h3>
                <ul data-role="listview" data-inset="true">
                    <li>
                        <div data-role="fieldcontain">
                            <label for="pre_page_size">个人账务页面显示数据条数(默认30):</label>
                            <input type="range" name="prePageSize" id="pre_page_size"
                                   value="${accountSetting.prePageSize}"
                                   min="10" max="100"/>
                            <form:errors path="prePageSize" cssClass="form_error"/>
                        </div>
                    </li>
                    <li data-role="fieldcontain">
                        <fieldset data-role="controlgroup">
                            <legend>个人账务页面默认显示类型:</legend>
                            <form:radiobutton path="showType" value="ALL" id="show_type_all"/>
                            <label for="show_type_all">显示公开账务</label>

                            <form:radiobutton path="showType" value="SELF" id="show_type_self"/>
                            <label for="show_type_self">只显示我的</label>

                            <form:radiobutton path="showType" value="LATEST" id="show_type_latest"/>
                            <label for="show_type_latest">显示最近10天</label>
                        </fieldset>
                    </li>
                    <li data-role="fieldcontain">
                        <fieldset data-role="controlgroup">
                            <legend>个人账务页面默认排序规则:</legend>
                            <form:radiobutton path="sortType" value="DEFAULT" id="sort_type_default"/>
                            <label for="sort_type_default">默认排序</label>

                            <form:radiobutton path="sortType" value="DATE" id="sort_type_date"/>
                            <label for="sort_type_date">记录日期</label>

                            <form:radiobutton path="sortType" value="TYPE" id="sort_type_type"/>
                            <label for="sort_type_type">账务类型</label>
                        </fieldset>
                    </li>
                    <li data-role="fieldcontain">
                        <fieldset data-role="controlgroup">
                            <legend>账务自动统计周期:</legend>
                            <form:radiobutton path="statisticsType" value="NONE" id="statistics_type_none"/>
                            <label for="statistics_type_none">无</label>

                            <form:radiobutton path="statisticsType" value="WEEKLY" id="statistics_type_weekly"/>
                            <label for="statistics_type_weekly">每周</label>

                            <form:radiobutton path="statisticsType" value="MONTH" id="statistics_type_month"/>
                            <label for="statistics_type_month">每月</label>

                            <form:radiobutton path="statisticsType" value="HALF_YEAR" id="statistics_type_half_year"/>
                            <label for="statistics_type_half_year">每半年</label>

                            <form:radiobutton path="statisticsType" value="YEAR" id="statistics_type_year"/>
                            <label for="statistics_type_year">每年</label>
                        </fieldset>
                    </li>
                    <li data-role="fieldcontain">
                        <label for="send_statistics_email">发送账务统计邮件(每月一次):</label>
                        <form:select path="sendMonthStatisticsEmail" id="send_statistics_email" data-role="slider">
                            <form:option value="false" label="否"/>
                            <form:option value="true" label="是"/>
                        </form:select>
                    </li>
                    <li data-role="fieldcontain">
                        <button type="submit" data-theme="b">保存设置</button>
                    </li>
                </ul>
            </div>
        </form:form>
        <div data-role="controlgroup">
            <div data-role="collapsible" data-collapsed="true" data-theme="a" data-content-theme="c">
                <h3>已删除的账务数据 (${accountSetting.deletedAccountSize})</h3>
                <ul data-role="listview" data-inset="true">
                    <c:forEach items="${accountSetting.deletedAccounts}" var="account">
                        <li>
                            <a href="${contextPath}/m/account/setting/restore/${account.guid}" data-transition="slidedown">
                                <h3 class="${account.income?'red':''}">${account.typeName} </h3>

                                <p><strong>${account.amount}</strong></p>

                                <p>${account.description} </p>

                                <p class="ui-li-aside">${account.accountDate}</p>
                            </a>
                        </li>
                    </c:forEach>
                    <c:if test="${empty accountSetting.deletedAccounts}">
                        <li>
                            没有任何已删除的数据
                        </li>
                    </c:if>
                </ul>
            </div>
        </div>

    </div>

    <script type="text/javascript">
        $(function () {
            <c:if test="${param.result}">
            $("#account_setting_success_info").fadeIn(800).delay(800).fadeOut(800);
            </c:if>
        });
    </script>
</div>
</body>
</html>